// 导入 vue-eslint-parser，用于解析 Vue 文件的语法
import vueEslintParser from 'vue-eslint-parser';
// 导入 @typescript-eslint/parser，用于解析 TypeScript 文件的语法
import typescriptEslintParser from '@typescript-eslint/parser';

// 导出 ESLint 的配置，使用 ES 模块语法
export default [
    {
        // 指定此配置适用的文件范围，涵盖多种常见的前端文件类型
        files: ['**/*.{js,jsx,ts,tsx,vue}'],
        // 语言选项，配置代码运行的环境和解析器相关的设置
        languageOptions: {
            // 配置代码运行的环境，包含浏览器、ES2021 标准、Node.js 环境和 Jest 测试环境
            env: {
                browser: true,
                es2021: true,
                node: true,
                jest: true
            },
            // 指定使用 vue-eslint-parser 作为解析器，以支持 Vue 文件的解析
            parser: vueEslintParser,
            // 解析器的具体选项
            parserOptions: {
                // 指定 ECMAScript 版本为最新版本
                ecmaVersion: 'latest',
                // 指定代码的模块类型为 ES 模块
                sourceType: 'module',
                // 对于 TypeScript 代码，使用 @typescript-eslint/parser 进行解析
                parser: typescriptEslintParser,
                // 定义 JSX 的前缀为 React
                jsxPragma: 'React',
                // 启用 JSX 语法支持
                ecmaFeatures: {
                    jsx: true
                }
            }
        },
        // 配置要使用的插件
        plugins: {
            // 引入 vue 插件，用于检查 Vue 文件的代码规范
            vue: 'vue',
            // 引入 @typescript-eslint 插件，用于检查 TypeScript 文件的代码规范
            '@typescript-eslint': '@typescript-eslint/eslint-plugin'
        },
        // 具体的代码规则配置
        rules: {
            // eslint（https://eslint.bootcss.com/docs/rules/）

            // 要求使用 let 或 const 而不是 var，以避免变量提升带来的问题
            'no-var': 'error',
            // 不允许多个空行，最多允许连续一个空行，超过则发出警告
            'no-multiple-empty-lines': ['warn', { max: 1 }],
            // 在生产环境下禁止使用 console，在其他环境下不做限制
            'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
            // 在生产环境下禁止使用 debugger，在其他环境下不做限制
            'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
            // 禁止有空余的多行，避免代码中出现不必要的空白行
            'no-unexpected-multiline': 'error',
            // 关闭对不必要转义字符的检查
            'no-useless-escape': 'off',

            // typeScript (https://typescript-eslint.io/rules)

            // 禁止定义未使用的变量，有助于保持代码的简洁性
            '@typescript-eslint/no-unused-vars': 'error',
            // 禁止使用 @ts-ignore，推荐使用 @ts-expect-error 来处理类型检查问题
            '@typescript-eslint/prefer-ts-expect-error': 'error',
            // 关闭对使用 any 类型的限制
            '@typescript-eslint/no-explicit-any': 'off',
            // 关闭对非空断言的限制
            '@typescript-eslint/no-non-null-assertion': 'off',
            // 关闭对使用自定义 TypeScript 模块和命名空间的限制
            '@typescript-eslint/no-namespace': 'off',
            // 关闭对分号使用的检查
            '@typescript-eslint/semi': 'off',

            // eslint-plugin-vue (https://eslint.vuejs.org/rules/)

            // 关闭对组件名称必须为连字符连接的单词的要求
            'vue/multi-word-component-names': 'off',
            // 防止 <script setup> 中使用的变量在 <template> 里被标记为未使用
            'vue/script-setup-uses-vars': 'error',
            // 关闭对组件 prop 改变的限制
            'vue/no-mutating-props': 'off',
            // 关闭对模板中自定义组件属性命名样式的强制要求
            'vue/attribute-hyphenation': 'off'
        }
    },
    {
        // 此配置适用于 JavaScript 和 TypeScript 文件
        files: ['**/*.{js,jsx,ts,tsx}'],
        // 继承 ESLint 推荐的规则、TypeScript ESLint 推荐的规则以及 Prettier 插件的规则
        extends: [
            'eslint:recommended',
            'plugin:@typescript-eslint/recommended',
            'plugin:prettier/recommended'
        ]
    },
    {
        // 此配置适用于 Vue 文件
        files: ['**/*.vue'],
        // 继承 Vue 3 必要的规则
        extends: [
            'plugin:vue/vue3-essential'
        ]
    }
];    